<template>
  <div>
  <el-dialog title="商品价格信息" :close-on-click-modal="false" :visible.sync="visible" fullscreen center>
    <el-button class="miui-dialog-close-btn" @click="visible = false">关闭页面</el-button>
    <div class="mod-config">
      <basic-container>
        <el-card class="box-card" style="margin-bottom: 15px;">
          <div class="text item">
            <el-form inline size="mini" label-width="83px">
              <el-row>
                <el-button v-if="permissions.eims_eimsgoodsprice_add" icon="el-icon-plus" type="primary" size="mini"
                  style="float: right;" @click="addOrUpdateHandle(dataForm)">新增</el-button>
              </el-row>
            </el-form>
          </div>
        </el-card>

        <div class="avue-crud">
          <el-table :data="dataList" border v-loading="dataListLoading">
            <el-table-column prop="priceGroupName" label="价格组"></el-table-column>
            <el-table-column prop="taxRate" label="税率"></el-table-column>
            <el-table-column prop="taxPrice" label="含税价格"></el-table-column>
            <el-table-column prop="notTaxPrice" label="无税价格"></el-table-column>
            <el-table-column prop="price" label="零售价格"></el-table-column>
            <el-table-column prop="memo" label="备注" show-overflow-tooltip></el-table-column>
            <el-table-column prop="status" label="状态">
              <template slot-scope="scope">
                <span v-if="scope.row.status == '1'">启用</span><span v-else>禁用</span>
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button type="text" icon="el-icon-collection" @click="checkPriceGroupDetail(scope.row.id)">详情</el-button>
                <el-button v-if="permissions.eims_eimsgoodsprice_edit" type="text" icon="el-icon-edit"
                  @click="addOrUpdateHandle(scope.row)">修改</el-button>
                <el-button v-if="permissions.eims_eimsgoodsprice_del" type="text" icon="el-icon-delete"
                  @click="deleteHandle(scope.row.id)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>

        <div class="avue-crud__pagination">
          <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
            :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" background layout="total, sizes, prev, pager, next">
          </el-pagination>
        </div>
        <!-- 弹窗, 新增 / 修改 -->
        <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></table-form>
        <detail-dialog v-if="detailDialogVisible" ref="detailDialog"></detail-dialog>
      </basic-container>
    </div>
  </el-dialog>
  </div>
</template>

<script>
    import { goodsPriceFetchList, goodsPriceDelObj } from '@/api/eims/goods-price.js'
    import TableForm from './price-form.vue'
    import DetailDialog from './price-detail.vue'
    import { mapGetters } from 'vuex'

    export default {
    data () {
      return {
        visible: false,
        dataForm: {
          goodsId: 0,
        },
        dataList: [],
        pageIndex: 1,
        pageSize: 100,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false,
        detailDialogVisible: false
      }
    },
    components: { TableForm, DetailDialog },
    computed: {
      ...mapGetters(['permissions'])
    },
    methods: {
      getDataList (id) {
        this.dataForm.goodsId = id || 0
        this.visible = true
        this.dataListLoading = true
        let params = { current: this.pageIndex, size: this.pageSize }
        goodsPriceFetchList(Object.assign(params, this.dataForm)).then(response => {
          if(response.data.code == '0'){
            this.dataList = response.data.data.records
            this.totalPage = response.data.data.total
          }else{
            this.$message.error(response.data.msg)
          }
          this.dataListLoading = false
        })
      },
      // 每页数
      sizeChangeHandle(val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle(val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 新增 / 修改
      addOrUpdateHandle(data) {
        this.addOrUpdateVisible = true
        this.$nextTick(() => { this.$refs.addOrUpdate.init(data) })
      },
      // 查看商品价格组详情
      checkPriceGroupDetail(data) {
        this.detailDialogVisible = true
        this.$nextTick(() => { this.$refs.detailDialog.init(data) })
      },
      // 删除
      deleteHandle(id) {
        this.$confirm('是否确认删除ID为' + id, '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' })
        .then(function() { return goodsPriceDelObj(id) })
        .then(response => {
          if(response.data.code == '0'){
            this.$message.success('删除成功')
            this.getDataList()
          }else{
            this.$message.error(response.data.msg)
          }
        })
      }
    }
  }
</script>
